import React, { Component, PropTypes } from 'react';
import { connect } from 'dva';
import { Form, Input, Button, Row } from 'antd';
import styles from './Login.less'
import { imgUrl } from '../config/system';
const FormItem = Form.Item;

function Login({ common, form, dispatch }) { 

  const { loginLoading } = common

  const { getFieldDecorator, getFieldsValue, validateFieldsAndScroll } = form;

  const okHandler = () => {
    validateFieldsAndScroll((errors, values) => {
      if (errors) {
        return
      }
      dispatch({
        type: 'common/login',
        payload: { ...getFieldsValue() },
      });
    })
  };

  return (
    <div style={{width:'100%',height:'100%',backgroundColor:'#e8edf0'}}>
    <div className={styles.form}>
      <div className={styles.logo}>          
        <img src={'images/logo1.png'} />
        <span>资产管理系统</span>
      </div>
      <form>
        <FormItem hasFeedback>
          {getFieldDecorator('account', {
            rules: [
              {
                required: true, message: "请填写用户名",
              },
            ],
          })(<Input size="large" onPressEnter={okHandler} placeholder="用户名" />)}
        </FormItem>
        <FormItem hasFeedback>
          {getFieldDecorator('password', {
            rules: [
              {
                required: true, message: "请填写密码",
              },
            ],
          })(<Input size="large" type="password" onPressEnter={okHandler} placeholder="密码" />)}
        </FormItem>
        <Row>
          <Button type="primary" size="large" onClick={okHandler} loading={loginLoading}>
            登录
          </Button> 
         
         <p style={{textAlign: "right"}}>          
            {/*<span style={{marginRight: "0px"}}><a href={imgUrl+"/UnityWebPlayerDevelopment.exe"} >下载插件</a></span>*/}
            <span style={{marginRight: "0px"}}>版本:v20180323</span>
          </p> 
          
        </Row>
      </form>
    </div>
    
    </div>
 );
}

function mapStateToProps(state) {
  return { common : state.common,loading:state.loading.models.common};
}
Login = Form.create()(Login);

export default connect(mapStateToProps)(Login);